import router from '@/router' // 引入路由实例
import store from '@/store' // 引入vuex store实例
import NProgress from 'nprogress' // 引入一份进度条插件
import 'nprogress/nprogress.css' // 引入进度条样式

// 全局导航前置守卫
router.beforeEach(async(to, from, next) => {
  // 显示进度条
  NProgress.start()
  // 判断是否有toen
  if (store.getters.token) {
    // 去登录页则直接回到首页
    if (to.path === '/login') {
      next('/')
    } else {
      // 如果没有用户ID情况下，先请求用户信息，做动态路由
      if (!store.getters.userId) {
        // 获取用户权限路由标识
        const { roles } = await store.dispatch('user/getUserInfo')
        //  调用筛选用户权限路由方法
        const result = await store.dispatch('permission/filterRoutes', roles.menus)
        // 动态添加用户路由，只需添加有权限的路由，静态路由已经在router模块已经加了
        // 404路由需要放在动态路由后面，要不然刷新会出现404界面
        router.addRoutes([...result, { path: '*', redirect: '/404', hidden: true }])
        // 固定写法，必须多次放行
        next(to.path)
      }
      // 其他界面放行
      next()
    }
  } else {
    // 没token时，去登录页则放行
    if (['/login', '/404'].indexOf(to.path) > -1) {
      next()
    } else {
    // 反之去登录页
      next('/login')
    }
  }
  // 手动关闭
  NProgress.done()
})

// 全局导航后置守卫
router.afterEach((to, from, next) => {
  // 关闭进度条
  NProgress.done()
})
